// 获取body节点
let body = $("body");
// 获取显示区节点
let show_area = $(".show_area");

// bom，窗口滚动事件
window.onscroll = function () {
  // 获取滚动距离（兼容性）
  let scrollTop =
    document.documentElement.scrollTop ||
    window.pageYOffset ||
    document.body.scrollTop;
  // 获取当前视口高度
  let view_height = window.innerHeight || document.documentElement.clientHeight;
  let tem = scrollTop + view_height;

  // 判断是否到底
  if (body[0].offsetHeight - tem <= 0.5) {
    console.log("到底了！");

    // 加载新节点
    show_More(2, 1, show_area);
  }
};

// 添加点击事件
body.bind("click", (evt) => {
  target = evt.target;
  if (target.parentNode.className.includes("goods_item")) {
    location.href = `http://localhost:8080/%E5%95%86%E5%9F%8E%E6%B5%8F%E8%A7%88/detail.html?id=${target.parentNode.dataset.index}`;
  }
});

// 加载新节点
// 传参 添加区域 添加列表
function add_item(show_area, item_list) {
  let node_list = item_list.map((item) => {
    return $(` <section data-index=${item.id} class="goods_item">
    <div class="pic" ></div>
    <div class="text">${item.model}</div>
  </section>`);
  });

  node_list.forEach((item) => {
    show_area.append(item);
  });
}

// 用promise获取数据
function show_More(num, page, show_area) {
  let options = {
    url: `http://localhost:3000/goods_list?_page=${page}&_limit=${num}`,
  };
  p_ajax(options)
    .then((res) => {
      //  加载节点
      add_item(show_area, JSON.parse(res));
    })
    .catch(() => {
      console.log("错误啦");
    });
}
